<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <script>
// ---------------------------------------------------------------------------------------------------------------------------------
    //改变元素组的方法
        // var arr = [1,2,3,4,5];
        // var val = arr.push(1,2,3,4,'a');//在数组的后面增加，会改变原来的数组,返回数组的长度 10

        // var arr1 = [1,2,3,4,5];
        // var val1 = arr1.pop(1,2,3,'a');//去除数组最后一位，会改变原来的数组，里面参数没有作用，返回数组去除的那个项 5

        // var arr2 = [1,2,3,4,5];
        // var val2 = arr2.unshift(1,2);//在数组前面增加，会改变原来的数组，返回数组的长度 7
        
        // var arr3 = [1,2,3,4,5];
        // var val3 = arr3.shift(2,3);//去除数组最前一位，会改变原来的数组，里面参数没有作用，返回数组去除的那个项1

        // var arr4 = [1,2,3];
        // var val4 = arr4.reverse();//逆转数组，会改变原来的数组，返回逆转的数组，[3,2,1]

        // var arr5 = [1,2,3];
        // var val5 = arr5.splice(1,1,'a');//arr5 [1,'a',3] 返回[2]
        // // var val5 = arr5.splice(0,0,'a');//['a',1,2,3] 返回[]
        // //splice(从第几位开始，接取多少长度，在切口处添加数据);
        // //会改变原来的数组
        // //返回切除的数组

        // var arr6 = [1,2,3,4,5,6,7,8];
        // var val6 = arr6.sort(function(x,y){
        //     return x-y;
        // })//升序
        // var val6 = arr6.sort(function(x,y){
        //     return x-y;
        // })//降序
        // var val6 = arr6.sort(function(x,y){
        //     return Math.random() - 0.5;
        // })//随机排序
        
        //sort 里面的function 排序，参数两个返回负数，不改变位置，返回正数，调换位置
        //返回值为排序后的数组
        //会改变原来的数组

        // var obj1 = {
        //     name : 'whh',
        //     age : 18,
        //     sex : 'female'
        // }
        // var obj2 = {
        //     name : 'whh1',
        //     age : 40,
        //     sex : undefined
        // }
        // var obj3 = {
        //     name : 'whh2',
        //     age : 20,
        //     sex : 'male'
        // }
        // var arr = [obj1, obj2, obj3];
        // //年龄升序
        // arr.sort(function(x,y){
        //     var x = x.age;
        //     var y = y.age;
        //     return x - y;
        // })

        // var arr = ['dsadasdas', 'sdsad', 'dsad', 'dsadasdasdsadas', 'dsa'];
        // //按照字符串长度升序排序
        // arr.sort(function(x, y){
        //     return x.length - y.length;
        // })

// ---------------------------------------------------------------------------------------------------------------------------------
    //不能改变元数组的方法
             var arr = [1, 2, 3, 4, 5, 6];
             var arr1 = ['a', 'b', 'c'];
             var newArrCon =  arr.concat(arr1);//[ 1, 2, 3, 4, 5, 6, "a", "b", "c" ]

             var newArrToS = arr.toString();//"1,2,3,4,5,6"

             var newArrSli1 = arr.slice();//全部接取[1, 2, 3] 以后从类数组转换为数组比较有用
             var newArrSli2 = arr.slice(2);//从第二位开始截取(包含第二位)到末尾[3, 4, 5, 6]
             var newArrSli3 = arr.slice(3,5);//从第三位开始(包含第三位)截取到第5位(不包含第五位)[4, 5]
             
             //会将数组以参数里面的字符串链接成为新的字符串"1_2_3_4_5_6"返回的是字符串
             //join方法会将数组返回为字符串
             var newArrJoin = arr.join("_");//"1_2_3_4_5_6"
             var newArrJoin1 =arr.join("");//"123456"
            
            //split方法会将字符串返回为数组
             var newString = "1,2,3,4,5,6";
             var newArrSplit1 = newString.split(",");//返回[ "1", "2", "3", "4", "5", "6" ]
             var newArrSplit2 = newString.split("2");//返回["1,", ",3,4,5,6"]
             var newArrSplit3 = newString.split("");//[ "1", ",", "2", ",", "3", ",", "4", ",", "5", ",","6" ]

            //将名字链接起来
            var name1 = "name1";
            var name2 = "name2";
            var name3 = "name3";
            var name4 = "name4";
            // 1：直接+号链接的话，因为原始值是以栈内存存储的，属于先进后出，所以要先一个拿出来，然后拼到一起，然后再拿出来再拼到一起.....，然后再放进去，这样对内存消耗比较大
            // 2:最好的方法是全部存储到一个数组里面，然后jion，因为数组的jion方法是散列方法去找的，比较优化。
            // var strArr = [name1, name2, name3, name4];
            // newStr = strArr.join("");//"name1name2name3name4",如果jion()里面不填任何参数，默认用 ',' 链接
    </script>
</body>
</html>